<template>
    <div>
      <div class="detail-footer">
        <div class="col-xs active">
          <i class="iconfont icon-shoucang"></i>
          <span>收藏</span>
        </div>
        <div class="col-xs">
          <i class="iconfont icon-pinglun"></i>
          <span>评论</span>
        </div>
        <div class="col-xs">
          <i class="iconfont icon-dianzan"></i>
          <span>点赞</span>
        </div>
      </div>
    </div>
</template>

<script>
export default {
  name: 'detail-footer'
}
</script>

<style scoped>
.detail-footer{width: 100%;background-color: #fff; position: fixed;bottom: 0;display: flex;height: 50px;align-items: center;justify-content: space-between;border-top: 1px #efefef solid;}
  .detail-footer .col-xs{width: 33.3333%;display: flex;justify-content: center;line-height: 24px;font-size: 14px;}
  .detail-footer > .active > i{color: #25a4bb;}
  .detail-footer .col-xs > span{margin-left: 7px;}
</style>
